$defauli-color: #2c2d2c
$orge-color: #e53100

@mixin beyond-hidden
    overflow: hidden
    white-space: nowrap
    text-overflow: ellipsis

body
    font-family: "微软雅黑"
    background-color: #fff

a
    color: #2c2d2c
    &:hover,&:focus
        text-decoration: underline

.show-sm
        display: none

.display-table
        width: 100%
        height: 100%
        display: inline-table
        text-align: center
        vertical-align: middle 
        .display-cell  
            width: 100%
            height: 100%
            display: table-cell
            text-align: center 
            vertical-align: middle

header
    background-color: #fff
    padding: 10px 0
    border-bottom: 5px solid #332d2d;
    .nav
        color: $defauli-color
        padding: 15px 0 10px
        line-height: 35px
        a
            display: inline-block
            padding: 0 7px
            color: #333
            &:hover
                color: #333

.ico-til
    background: url(../img/con_title-bg.png) no-repeat left 2px
    padding-left: 25px

.til-main
    font-size: 22px
    font-weight: bold
    line-height: 40px
    padding: 10px 0
    span
        display: block
    .til-main-tex
        margin-right: 10px
    .til-desc-top
        font-size: 12px
        line-height: 20px
        vertical-align: top
        font-weight: normal
    .til-desc-bom
        font-size: 16px
        line-height: 20px
        vertical-align: top
        color: $orge-color
        font-weight: normal    
    &:after
        width: 100%
        height: 1px        
        display: block 
        content: ''
        clear: both


.solder
    max-width: 1440px
    margin: 0 auto
    .sold-ban-list
        text-align: center
        width: 100%
        position: absolute
        bottom: 15%
        ul
            max-width: 1060px
            margin: 0 auto
            li
                padding: 10px
        a
            display: block
            position: relative
            span
                position: absolute
                top: 0
                left: 0
                width: 100%
                height: 100%
                display: none
                background-color: rgba(141,24,26,0.75)
                line-height: 92px
                font-size: 18px
                color: #fff
                overflow: hidden
            &:hover
                span
                    display: block

nav
    margin-top: -21px
    position: relative
    z-index: 50
    background: url(../img/nav_bg.gif) repeat-x center center
    .container
        background-color: #ea5002
        text-align: center
        padding: 15px
        a
            color: #fff
            line-height: 15px
            font-size: 16px
            &:hover
                color: #fff
        li
            border-right: 1px dotted #FFF
            line-height: 15px
            font-size: 16px
            &:first-child
                border-left: 1px dotted #FFF

article
    max-width: 1440px
    margin: 0 auto

.con-01
    .con-01-head
        background: url(../img/con_01_bg.jpg) repeat center center
    .con-01-block
        margin: 15px
        position: relative
        &:before
            position: absolute
            left: -10px
            top: -10px
            color: #dcdcdc
            display: block 
            font-size: 62px
            font-family: Arial, Helvetica, sans-serif
        &:after
            position: absolute
            right: -40px
            top: 30%
            width: 60px
            height: 6px
            background-color: #dcdcdc
            display: block 
            font-size: 62px
            font-family: Arial, Helvetica, sans-serif
    .con-01-block-cont
        width: 100%
        height: 100%
        font-size: 14px
        border: 3px solid #dcdcdc
        background-color: #fff
        border-radius: 6px
        padding: 10px 5px
        position: relative
    .con-01-til
        font-size: 18px
        text-align: center
        font-weight: bold
        margin-bottom: 10px

.con-02
    background: url(../img/con_02_bg-top.jpg) repeat-x center top
    position: relative
    padding-bottom: 30px
    &:after
        position: absolute
        left: 0
        bottom: 0
        width: 100%
        height: 27px        
        display: block 
        content: ''
        background: url(../img/con_02_bg-bom.jpg) repeat-x center bottom
    .con-02-til
        font-size: 16px
        line-height: 20px
        margin: 5px 0 10px
        font-weight: bold
    .con-02-list-imgs
        ul
            padding: 0
            li
                padding: 3px
                float: left
    .con-02-more-btn
        color: #999
        font-size: 12px
    .con-02-big-btn
        margin: 15px 0
        a
            display: block
            width: 130px
            line-height: 24px
            padding: 0 15px
            text-align: center
            background-color: #ee3408
            color: #fff

.con-03
    background: #151515
    color: #e5e4e2
    .con-03-list
        li
            margin-bottom: 15px
    .con-03-list-top
        background-color: #cbcbcb
        a
            display: block
            padding-top: 30px
        .con-03-list-til
            background-color: #eb4f02
            color: #fff
            line-height: 30px
            text-align: center
            position: relative
            span
                position: relative
                z-index: 10
            &:before
                position: absolute
                left: 0%
                top: -15px
                height: 0px        
                display: block 
                content: ''
                border-top: 30px solid transparent
                border-bottom: 30px solid transparent
                border-left: 50px solid #eb4f02
            &:after
                position: absolute
                right: 0%
                top: -15px
                height: 0px        
                display: block 
                content: ''
                border-top: 30px solid transparent
                border-bottom: 30px solid transparent
                border-right: 50px solid #eb4f02
        .con-03-list-img
            img
                margin: 0 auto
    .con-03-list-tex
        background-color: #e3e3e3
        margin-top: 5px
        padding: 15px
        color: #000
        border-bottom: 7px solid #ea5002
    .con-03-transit-til
        font-size: 18px
        color: #e13f01
        text-align: center
        margin-bottom: 15px
.con-04
    background: #151515
    color: #e5e4e2
    padding-bottom: 25px
    .con-04-list-img
        margin-bottom: 25px
        img
            width: 100%
    .con-04-list-til
        font-size: 16px
        color: #ee3408
        padding: 5px 0
    .con-04-list-tag
        margin-bottom: 15px
        font-size: 12px
        a
            color: #fff
    .con-04-list-tick
        font-size: 14px
        color: #ee3408
        padding: 5px 0
    .con-04-list-tex
        font-size: 12px
    hr
        margin: 20px 0
        background: #555555

.con-05
    padding-bottom: 25px
    .con-05-top
        height: 31px
        background: #484848
        .con-05-top-cont
            display: block
            height: 31px
            margin: 0 auto
            max-width: 1000px
            background: #6c6a6b
            &:after
                display: block
                height: 31px
                margin: 0 auto
                display: block 
                max-width: 540px
                content: ''
                background: #858384
    .con-05-til
        font-size: 16px
        font-weight: bold
        color: #000
        line-height: 20px
        margin-bottom: 10px
    .con-05-spec
        text-align: center
        margin-bottom: 10px
        a
            color: #333
        .con-05-spec-img
            border: 1px solid #eee
            padding: 1px
            img
                width: 100%
        .con-05-spec-til
            @include beyond-hidden
    .con-05-news
        line-height: 24px
        a
            color: #333
            line-height: 30px
            display: block
            @include beyond-hidden
    .mess_til
        margin-bottom: 20px
    .con-05-mess
        background-color: #f1f1f1
        height: 250px
        padding: 20px
        input.input
            width: 100%
            height: 24px
            border-radius: 0
            border: 1px solid #809dbd
            &:focus
                background-color: #d6e9fb
        select
            width: 100%
            height: 24px
            border: 1px solid #809dbd
        textarea
            width: 100%
            border: 1px solid #809dbd
            &:focus
                background-color: #d6e9fb
        button
            color: #ffffff
            width: 100px
            height: 28px
            line-height: 26px
            padding: 0
            background-color: #c51517
        .colorred
            color: #c00
            padding-left: 3px

footer
    height: 56px
    background: #30303d
    color: #fefefe
    text-align: center
    padding: 20px 0
    width: 100%
    p
        font-size: 12px
        line-height: 16px

.mask
    display: none
    top: 0
    left: 0
    right: 0
    bottom: 0
    position: fixed
    z-index: 150
    .maskbg
        position: absolute
        background-color: #000000
        opacity: 0.4
        top: 0
        left: 0
        right: 0
        bottom: 0
        z-index: 151
    .maskcont
        position: absolute
        top: 50%
        width: 100%
        z-index: 152
        text-align: center
        p
            position: relative
            display: inline-block
            span
                position: absolute
                top: -40px
                right: 0
                width: 40px
                line-height: 36px
                height: 40px
                font-size: 32px
                display: block
                background-color: #ee3408
                color: #fff
                cursor: pointer
        img
            max-width: 100%
.xl-bottom
    z-index: 100

@media (min-width: 481px) and (max-width:766px)
    header

@media (max-width: 759px)
    .banner .pager-next, .banner .pager-prev
        display: none
    
    nav
        margin-top: 0

@media (max-width: 580px)
    
    header
        padding: 10px 0
        .logo
            width: 100%
            img
                display: block
                margin: 0 auto
        .nav
            display: block
            width: 100%
            text-align: center
            padding: 5px 0 0px
            line-height: 20px
            a
                padding: 0 10px

@media (max-width: 480px)
    .show-sm
        display: block
    .xsm1,.xsm10,.xsm11,.xsm12,.xsm2,.xsm3,.xsm4,.xsm5,.xsm6,.xsm7,.xsm8,.xsm9
        float: left
    .xsm12
        width: 100%
    .xsm11
        width: 91.66666667%
    .xsm10
        width: 83.33333333%
    .xsm9
        width: 75%
    .xsm8
        width: 66.66666667%
    .xsm7
        width: 58.33333333%
    .xsm6
        width: 50%
    .xsm5
        width: 41.66666667%
    .xsm4
        width: 33.33333333%
    .xsm3
        width: 25%
    .xsm2
        width: 16.66666667%
    .xsm1
        width: 8.33333333%

    header
        padding: 10px 0
        .nav
            padding: 5px 0 0px
            line-height: 20px
            a
                padding: 0 10px

@media (max-width: 370px)
    .hide-ml
        display: none
    .xml1,.xml10,.xml11,.xml12,.xml2,.xml3,.xml4,.xml5,.xml6,.xml7,.xml8,.xml9
        float: left
    .xml12
        width: 100%
    .xml11
        width: 91.66666667%
    .xml10
        width: 83.33333333%
    .xml9
        width: 75%
    .xml8
        width: 66.66666667%
    .xml7
        width: 58.33333333%
    .xml6
        width: 50%
    .xml5
        width: 41.66666667%
    .xml4
        width: 33.33333333%
    .xml3
        width: 25%
    .xml2
        width: 16.66666667%
    .xml1
        width: 8.33333333%
        
    header
        padding: 10px 0
        .nav
            padding: 5px 0 0px
            line-height: 20px
            a
                padding: 0 3px


@media (min-width: 581px)
    .til-main
        .til-main-tex
            float: left
    .con-02,.con-04
        .til-desc-bom
            margin-top: 13px

@media (min-width: 760px)

    .solder
        .banner
            .pointer
                padding-bottom: 40px

    .til-main
        padding: 15px 0
        .til-main-tex
            font-size: 28px
            float: left
    .con-02,.con-04
        .til-desc-bom
            margin-top: 15px
    .con-01
        .con-01-bom
            padding: 35px 0 15px
        .con-01-block
            float: left
            text-align: center
            .con-01-til
                margin-top: 25px
        .con-01-block-cont
            border-radius: 50px
            border: 6px solid #dcdcdc            
            z-index: 10
        .con-01-block01
            margin-top: 50px
            width: 200px
            height: 300px
            line-height: 26px
            &:before
                content: '1'
            &:after
                content: ' '
                top: 45%
        .con-01-block02
            width: 260px
            height: 380px
            line-height: 26px
            &:before
                content: '2'
            &:after
                content: ' '
                top: 55%
        .con-01-block03
            margin-top: 40px
            width: 200px
            height: 330px
            line-height: 22px
            &:before
                content: '3'

    .con-02
        .con-02-list-imgs
            ul
                li
                    padding: 3px 10px

    .con-03
        .con-03-transit
            text-align: center
            padding: 20px 30px
            margin-bottom: 50px
            .con-03-transit-cont
                display: block
                max-width: 900px
                margin: 0 auto
                padding: 0 0px 10px
                border-bottom: 13px solid #ef3409
                position: relative                
                &:before
                    position: absolute
                    left: -29px
                    top: 100%
                    display: block 
                    content: ''
                    width: 39px
                    height: 90px
                    background: url(../img/con-03-transit-bottom.png) repeat center center
                &:after
                    position: absolute
                    right: -21px
                    bottom: -13px
                    display: block 
                    content: ''
                    width: 103px
                    height: 166px
                    background: url(../img/con-03-transit-right.png) repeat center center
            .con-03-transit-til
                font-size: 24px
                line-height: 42px
                color: #e13f01
                text-align: center
                margin-bottom: 15px
            p
                line-height: 28px

@media (min-width: 760px) and (max-width:999px)
    header

@media (min-width: 1000px)
    
    .til-main
        padding: 20px 0
        .til-main-tex
            font-size: 32px
            float: left
    .con-02,.con-04
        .til-desc-bom
            margin-top: 18px

    .con-01
        .con-01-block            
            float: left
            text-align: center
            .con-01-til
                margin-top: 25px
                i
                    position: relative
                    height: 24px
                    width: 1px
                    vertical-align: top
                    display: inline-block !important
                    img
                        position: absolute
                        bottom: 0
                        left: 0
                        width: auto
                        height: 80px
            &:before
                font-size: 78px
        .con-01-block-cont
            border-radius: 50%
        .con-01-block01
            margin-top: 50px
            width: 280px
            height: 280px
            line-height: 26px
            &:before
                top: 5px
                left: 20px
            .con-01-til
                i
                    width: 10px
                    img
                        right: 5px
                        left: auto
                        height: 50px
        .con-01-block02
            width: 350px
            height: 350px
            line-height: 26px
            &:before
                top: 10px
                left: 20px
            .con-01-til
                i
                    width: 00px
                    img
                        right: -135px
                        left: auto
                        bottom: 20px
                        height: 80px
        .con-01-block03
            margin-top: 50px
            width: 280px
            height: 280px
            line-height: 22px
            &:before
                top: 5px
                left: 20px
            .con-01-til
                i
                    width: 1px
                    img
                        bottom: -5px
    .con-02
        .con-02-list-imgs
            ul
                li
                    padding: 3px 5px

    .con-03
        .con-03-transit
            .con-03-transit-cont
                padding: 0 0px 20px
            .con-03-transit-til
                font-size: 26px
                line-height: 42px

@media (min-width: 1000px) and (max-width:1199px)

    header
        
@media (min-width: 1200px)
    
    .til-main
        padding: 30px 0
        .til-main-tex
            font-size: 42px
            float: left
    .con-02,.con-04
        .til-desc-bom
            margin-top: 20px
    .con-01
        .con-01-block            
            float: left
            text-align: center
            .con-01-til
                margin-top: 50px
                i
                    position: relative
                    height: 24px
                    width: 1px
                    vertical-align: top
                    display: inline-block !important
                    img
                        position: absolute
                        bottom: 0
                        left: 0
                        width: auto
                        height: 80px
            &:before
                font-size: 96px
        .con-01-block-cont
            border-radius: 50%
        .con-01-block01
            margin-top: 50px
            width: 340px
            height: 340px
            line-height: 28px
            &:before
                top: 5px
                left: 20px
            .con-01-til
                margin-top: 70px
                i
                    width: 30px
                    img
                        right: 10px
                        left: auto
                        height: 65px
        .con-01-block02
            width: 450px
            height: 450px
            line-height: 28px
            &:before
                top: 10px
                left: 50px
            .con-01-til
                margin-top: 90px
                i
                    width: 1px
                    img
                        right: 5px
                        left: 18px
                        bottom: 24px
                        height: 85px
        .con-01-block03
            margin-top: 50px
            width: 340px
            height: 340px
            line-height: 28px
            &:before
                top: 5px
                left: 30px
            .con-01-til
                margin-top: 40px
                i
                    width: 35px
                    img
                        bottom: -5px
                        height: 75px
    .con-02
        .con-02-list-imgs
            ul
                li
                    padding: 10px 14px
    
    .con-03
        .con-03-transit
            .con-03-transit-cont
                padding: 0 0px 30px
            .con-03-transit-til
                font-size: 28px
                line-height: 42px